﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Layout/Main.master" AutoEventWireup="true" CodeFile="Keyword.aspx.cs" Inherits="Apps_Keyword" %>

<asp:Content ID="Content1" ContentPlaceHolderID="cph_head" runat="Server">
    <link href="http://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css" rel="stylesheet" />
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="cph_body" runat="Server">
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12 col-lg-12">
                <h3>热门关键字管理</h3>
            </div>
            <div class="col-md-12 col-lg-12"></div>
        </div>
        <div class="row">
            <div class="col-md-12 col-lg-12">
                <button type="button" class="btn btn-success btn-addkey">添加关键词</button>
                <table id="keylist" class="table table-hover">
                    <thead>
                        <tr>
                            <td>#</td>
                            <td>关键字</td>
                            <td>URL</td>
                            <td>排序</td>
                            <td>激活</td>
                            <td>操作</td>
                        </tr>
                    </thead>
                    <tbody>
                        <% 
                            if (list != null)
                            {
                                for (int i = 0; i < list.Count; i++)
                                {
                        %>
                        <tr class="kw<%=list[i].id %>">
                            <td><%= i + 1 %></td>
                            <td><%= list[i].keywords %></td>
                            <td><%= list[i].url %></td>
                            <td><%= list[i].orderBy %></td>
                            <td><%= list[i].active == 1 ? "<label class='bg-success'>已激活</label>" : "<label class='bg-danger'>未激活</label>" %></td>
                            <td>
                                <a class='btn btn-sm btn-primary btn-edt' data-list-id="<%= list[i].id %>">编辑</a>
                                <a class='btn btn-sm btn-danger btn-del' data-list-id="<%= list[i].id %>">删除</a>
                            </td>
                        </tr>
                        <%
                                }
                            }
                        %>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <aside class="popup">
        <div class="container popup-item">
            <div class="row">
                <div class="col-md-12 col-lg-12">
                    <h4><span class="mod"></span>热门关键字</h4>
                </div>
            </div>
            <div class="form-group">
                <label for="txtkey">关键字</label>
                <input type="text" class="form-control" id="txtkey" placeholder="热门关键字" />
            </div>
            <div class="form-group">
                <label for="txturl">URL</label>
                <input type="text" class="form-control" id="txturl" placeholder="链接地址" />
            </div>
            <div class="form-group">
                <label for="txtorder">排列顺序</label>
                <input type="text" class="form-control" id="txtorder" placeholder="排列顺序" />
            </div>
            <div class="checkbox">
                <label>
                    <input type="checkbox" id="txtactive" checked />
                    是否激活
                </label>
            </div>
            <div class="form-group tolls">
                <button id="btnSubmit" type="button" class="btn btn-success">保 存</button>
                <button id="btnCanel" type="button" class="btn btn-default">取 消</button>
            </div>
        </div>
    </aside>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="cph_foot" runat="Server">
    <script src="http://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
    <script src="../Content/js/Apps.js"></script>
    <script>
        $(function () {
            var list = $('#keylist'),
                list_edt = $('.btn-edt'),
                list_del = $('.btn-del'),
                list_add = $('.btn-addkey'),
                pop = $('.popup');

            listInit(list);

            // keyword delete event
            list_del.on('click', function () {
                var c = $.confirm({ title: '是否确认删除这个关键字？', content: '', buttons: { 取消: function () { c.close() }, 确认删除: listDel } });
            });

            // keyword edit event
            list_edt.on('click', function () {
                pop.fadeIn(250);
                pop.find('.mod').text('编辑');
                pop.find('#btnSubmit').one('click', listEdit);
            });

            // keyword add event
            list_add.on('click', function () {
                pop.fadeIn(250);
                pop.find('.mod').text('添加');
                pop.find('#btnSubmit').one('click', listAdd);
            });

            // close popup event
            $('#btnCanel').on('click', function () {
                pop.fadeOut(250);
                pop.find('.mod').text('');
            });

            function listAdd() {

            }

            function listEdit() {

            }

            function listDel() {
                console.log(1)
            }

            function listInit(obj) {
                obj.DataTable({
                    ordering: false,
                    pageLength: 15,
                    info: false,
                    lengthChange: false,
                    deferRender: true,
                    language: {
                        paginate: {
                            last: "末页",
                            previous: "上一页",
                            next: "下一页",
                            first: "首页"
                        },
                        search: "搜索",
                    }
                });
            }
        });
    </script>
</asp:Content>

